<template>
	<div class="userComment w944">
		<div class="label_top">
			<button @click="reBack"><i><&nbsp;</i>返回</button>
			<p>{{updateTitle}}</p>
		</div>
		<div class="label_table">
			<el-table ref="multipleTable" :data="tableData" border @selection-change="handleSelectionChange">
				<el-table-column prop="nickname" label="用户名"></el-table-column>
				<el-table-column prop="discuss" label="评论"></el-table-column>
			</el-table>
			<div class="fenyeMargin">
				<div class="pag_block">
					<el-pagination @current-change="handleCurrentChange" :current-page="currentpage" :page-size="pagesize" layout="prev, pager, next" :total="total"></el-pagination>
				</div>
			</div>
		</div>
	</div>
</template>
<script>
	export default {
		data() {
			return {
				userId:'',
				updateTitle:'',
		        pagesize: 15,
		        currentpage: 1,
		        total: 1,
				id:'',
				tableData: [],
				tableChecked:[],
				ids:[],
				multipleSelection: [],
			}
		},
		methods: {
			getParams() {
				this.userId = this.$route.params.userId;
				this.updateTitle = this.$route.params.updateTitle
				console.log(this.$route.params);
			},
			getCommentsList(){
				let that = this;
				this.$ajax({
					url: this.$root.jifuUrl + "/mns/coursewareDiscussChapter/studentCoursewareDiscussChapterList",
					headers:{'ContentType': 'application/json; charset=utf-8'},
					method: 'POST',
					data: {
						userId:this.userId,
						courseId:this.courseId,
						page:this.currentpage,
						num:this.pagesize
					},
					success: res => {
						if(res.data.code == 200) {
							this.tableData = res.data.data.list;
							this.total=res.data.data.pageParam.items;
						}
					}
				});
			},
			toggleSelection(rows) {
				if(rows) {
					rows.forEach(row => {
						this.$refs.multipleTable.toggleRowSelection(row, !this.allSelect)
					})
					this.allSelect = !this.allSelect;
				}
			},
			handleSelectionChange(val) {
				this.multipleSelection = [];
				for(var i = 0;i<val.length;i++){
					var s={id:val[i].id}
					this.multipleSelection.push(s)
				}
			},
			handleCurrentChange(value) {
				this.currentpage = value;
				this.getLectureList();
			},
			reBack(){
				this.$router.go(-1);
			}
		},
		mounted: function() {
			this.getParams();
			if(this.userId==null||this.updateTitle==null){
				this.$store.commit('GET_comment');
				var s =this.$store.state.kcComment;
				this.userId=s.userId,
				this.updateTitle=s.updateTitle;
			}
			this.getCommentsList();
			window.addEventListener("beforeunload",()=>{
				s={
					userId : this.userId,
					updateTitle:this.updateTitle
				}	
				this.$store.commit('SET_comment', s);
			});
		}
	}
</script>

<style>
	.userComment{padding-bottom:100px}
	.userComment .el-table td:nth-child(4)>.cell:hover {background:#f5f7fa;}
	.userComment .el-table .cell,.userComment .el-table th div,.userComment .el-table--border td:first-child .cell,.userComment .el-table--border th:first-child .cell {padding:0;text-align:center;}
	.userComment .el-button {border:0;padding:12px 16px;}
	.userComment .el-button--mini,.userComment .el-button--mini.is-round {padding:0;}
	.userComment .el-button--mini{font-size: 14px;}
	.userComment .el-button.el-button--mini:nth-child(1) {color:#FF2D51}
	.userComment .el-button:hover {background:none;}
	.userComment .pag_block {float:right;margin-top:5px;}
	.userComment .el-table__row td:nth-child(3) .cell{padding-left: 32px;text-align: left;}
</style>